<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="css/detail.css">
    <link rel="stylesheet" href="css/tongyong.css">
    <link rel="stylesheet" href="./font_2615077_l1e0be3xhof/iconfont.css">
    <link rel="stylesheet" href="css/toubu.css">
</head>
<body>
     <!-- 头 -->
        
<div class="tonglan">
    <div class="container header">
        <ul class="yi">     
          
            <li class="off active">
                您好 ! <a href="./login.html">请登录</a>
            </li>
            <li class="on" id="oon">
                您好 ! <span>xxx</span>
               
              </li>
            <li>手机逛淘宝</li>
        </ul>
        <ul class="er">
            <li class="tb">我的淘宝
                <ol>
                    <li>我的足迹</li>
                    <li>我的足迹</li>
                </ol>
            </li>
            <li class="iconfont">&#xe604;购物车</li>
            <li class="iconfont">&#xe629;收藏夹</li>
            <li>商品分类</li>
            <li>免费开店</li>
            <li>千牛卖家中心</li>
            <li>联系客服</li>
            <li class="iconfont" id="last">&#xe626;网站导航
                <div class="d1">
                    <div>
                        <p style="color: red;">主题市场</p>
                        <ul>
                            <li>女装</li>
                            <li>女装</li>                                                    
                            <li>女装</li>
                            <li>女装</li>                 
                            <li>女装</li>
                        </ul>
                        <ul>
                            <li>女装</li>
                            <li>女装</li>                       
                            <li>女装</li>
                        </ul>
                        <ul>
                            <li>女装</li>                     
                            <li>女装</li>
                            <li>女装</li>
                            <li>女装</li>
                        </ul>
                        <ul>
                            <li>女装</li>                     
                            <li>女装</li>                         
                            <li>女装</li>                          
                          <li>女装</li>
                            <li>女装</li>
                        </ul>                   
                    </div>
                    <div>
                        <p style="color: blue;">精彩推荐</p>
                        <ul>
                            <li>女装</li>
                            <li>女装</li>                                          
                            <li>女装</li>
                        </ul>
                        <ul>
                            <li>女装</li>
                            <li>女装</li>
                            <li>女装</li>              
                            <li>女装</li>
                            <li>女装</li>
                            <li>女装</li>
                            <li>女装</li>
                            <li>女装</li>
                        </ul>
                        <ul>
                            <li>女装</li>
                            <li>女装</li>
                            <li>女装</li>
                           <li>女装</li>
                            <li>女装</li>
                            <li>女装</li>
                        </ul>
                        <ul>
                            <li>女装</li>
                            <li>女装</li>                          
                            <li>女装</li>
                            <li>女装</li>
                            <li>女装</li>
                        </ul>
                       
                    </div>
                    <div>
                        <p style="color: pink;">特色市场</p>
                        <ul>
                            <li>女装</li>
                            <li>女装</li>
                            <li>女装</li>                         
                            <li>女装</li>
                            <li>女装</li>
                            <li>女装</li>
                        </ul>
                        <ul>
                            <li>女装</li>
                            <li>女装</li>
                            <li>女装</li>                         
                            <li>女装</li>
                            <li>女装</li>
                            <li>女装</li>
                            <li>女装</li>
                        </ul>
                        <ul>
                            <li>女装</li>
                            <li>女装</li>                         
                            <li>女装</li>
                            <li>女装</li>
                            <li>女装</li>
                        </ul>
                        <ul>
                            <li>女装</li>
                            <li>女装</li>
                            <li>女装</li>
                            <li>女装</li>
                            <li>女装</li>                       
                        </ul>
                       
                    </div>
                    <div>
                        <p style="color: purple;">阿里app</p>
                        <ul>
                            <li>女装</li>
                            <li>女装</li>
                            <li>女装</li>                        
                            <li>女装</li>
                            <li>女装</li>
                            <li>女装</li>
                            <li>女装</li>
                        </ul>
                        <ul>
                            <li>女装</li>
                            <li>女装</li>
                            <li>女装</li>
                            <li>女装</li>                        
                            <li>女装</li>
                            <li>女装</li>
                        </ul>
                        <ul>
                            <li>女装</li>
                            <li>女装</li>
                            <li>女装</li>
                            <li>女装</li>
                            <li>女装</li>                      
                            <li>女装</li>
                            <li>女装</li>
                            <li>女装</li>
                        </ul>
                        <ul>
                            <li>女装</li>
                            <li>女装</li>
                            <li>女装</li>
                            <li>女装</li>
                            <li>女装</li>                
                         <li>女装</li>
                            <li>女装</li>
                        </ul>
                       
                    </div>
                </div>
            </li>
        </ul>
    </div>
</div>



  <div class="info container">
        <div class="left">
        <!-- 放大镜 -->
            <div class="box" id="box">
                <!-- 展示图片的盒子 -->
                    <div class="show">
                            <img src="./images/美女.jpg" alt="">
                            <div class="mask"></div>
                    </div>
                <!-- 列表盒子 -->
                    <div class="list">
                        <p class="active">
                            <img
                            src="./images/美女.jpg"
                            data-show="./images/美女.jpg"
                            data-enlarge="./images/美女.jpg"
                            alt="">
                        </p> 
                    </div>
                <!-- 放大的盒子 -->
                <div class="enlarge"></div>
            </div>
        </div>


        <div class="right">
            <div class="desc">商品描述商品描述商品</div>
            <div class="price"> 价格 <span>￥ 100.00</span> </div>
            <p class="pp">销量<span>20</span></p>
            <p class="p1">配送<span>北京科技职业学院</span></p>
            <p>
                <button class="BUTTON">立即购买</button>
                <button class="BUTTON">加入购物车</button>
            </p>
            <p class="p2">承诺<span>七天无理由</span>
                <span>公益宝贝</span>
            
            </p>
            <p class="p3">支付<span>蚂蚁花呗</span>
                <span>信用卡支付</span>
                <span>集分宝</span></p>
        </div>
  </div>
    <div class="detail container"></div>
  
  
<script src="../tabs.js"></script>
<script src="../jquery/jquery.min.js"></script>
<script src="./js/detali.js"></script>
<script src="./js/base.js"></script>

<script>
new Enlarge('#box')
</script> 
</body>
</html>